<template>
	<view class="security-app-box">
		<u-tabs
			height="60"
			:list="list"
			:show-bar="false"
			font-size="26"
			:bold="false"
			:is-scroll="false"
			:current="current"
			@change="changeTabs"
			class="tabs-border"
		></u-tabs>

		<view class="security-app-box-content">
			<hisTask v-if="cardCur == 'hisTask'"></hisTask>
			<preTask v-if="cardCur == 'preTask'"></preTask>
		</view>
	</view>
</template>

<script>
	export default {
		components: {
			preTask: () => import('./security/preTask.vue'),
			hisTask: () => import('./security/hisTask.vue')
		},
		data() {
			return {
				appHeight: 0,
				cardCur: 'preTask',
				current: 0,
				list: [
					{ name: '填报任务', value: 'preTask' },
					{ name: '历史任务', value: 'hisTask' }
				]
			}
		},
		async mounted() {
			// this.appHeight = await this.$getHeight()
		},
		computed: {},
		methods: {
			async share() {
				let base64 = await this.$share('#view-app')
				console.info(`base64:`, base64)
				uni.navigateTo({
					url: '/pages/other/share?data=' + encodeURIComponent(base64)
				})
			},
			changeTabs(index) {
				this.current = index
				this.cardCur = this.list[index].value
			}
		}
	}
</script>

<style lang="scss" scoped>
	.security-app-box {
		height: 100%;
		background: #fff;
		.tabs-border {
			border-bottom: 0.5rpx solid rgba(0, 0, 0, 0.061);
			padding: 0 20rpx;
		}
		.security-app-box-content {
			height: calc(100% - 60rpx);
		}
	}
</style>
